<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./发布订阅.js"></script>
</head>
<body>
    <div class="box1"></div>
    <div class="box2"></div>
    <div class="box3"></div>
</body>
    <script>
        let obj={}
        jack({
            data:obj,
            dataKey:'one',
            tag:'g1',
            selector:'.box1'
        })
        jack({
            data:obj,
            dataKey:'two',
            tag:'g2',
            selector:'.box2'
        })
        //一个数据要用在多个地方，dataKey和tag要和上次调用jack时保持一致
        //如果tag不一致，此属性的订阅者发生改变，Dep的listenList中虽然完整地保存所有订阅信息，但是
        //在修改obj此属性并调用trigger时，其中tag参数为最后一次调用jack时产生的闭包中的tag，此例为g3，
        //所以永远不会使用g2的订阅函数，box2中不会有值

        //如果dataKey不一致，单纯浪费空间
        jack({
            data:obj,
            dataKey:'two',
            tag:'g3',
            selector:'.box3'
        })
    </script>
</html>